<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米官网</title>
    <link rel="icon" href="images/favicon.ico">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="font/iconfont.css">
    <link rel="stylesheet" href="./lib/swiper.min.css">
    <script src="./lib/jquery-1.12.4.min.js"></script>
    <script src="./js/jquerycookie.js"></script>
    <script src="./js/plugin.js"></script>
    <script src="./js/utils.js"></script>
    <script src="./js/index.js"></script>
    <script src="./js/swiper.js"></script>
    <script src="./lib/swiper.min.js"></script>
</head>

<body>
    <!-- 顶部 -->
    <header>
        <div class="header-con">
            <ul>
                <li><a href="">小米商城</a><span>|</span></li>
                <li><a href="">MIUI </a><span>|</span></li>
                <li><a href="">loT </a><span>|</span></li>
                <li><a href="">云服务 </a><span>|</span></li>
                <li><a href="">天星数科 </a><span>|</span></li>
                <li><a href="">有品 </a><span>|</span></li>
                <li><a href="">小爱开放平台</a><span>|</span></li>
                <li><a href="">企业团购</a><span>|</span></li>
                <li><a href="">资质证照</a><span>|</span></li>
                <li><a href="">协议规则</a><span>|</span></li>
                <li><a href="">下载app<em></em>
                        <span><img src="./images/code.png"><i>小米商城</i></span></a><span>|</span></li>
                <li><a href="">智能生活</a><span>|</span></li>
                <li><a href="">Select Location</a><span>|</span></li>
            </ul>
            <div class="header-right">
                <a href="./login.html">登录</a><i>|</i>
                <a href="./login.html">注册</a><i>|</i>
                <a>消息通知</a>
                <div class="bigCart">
                    <i class="iconfont icon-gouwuchekong">
                    </i> <b>购物车 (0)</b>
                    <div class="cartBox">
                        <div class="loading"></div>
                        <ol>
                        </ol>
                        <div class="cartTotal hide clear-fix">
                            <span class="total">共 <em>0</em> 件商品<span class="price"><em></em>元</span></span>
                            <a class="btn btn-primary btn-cart">结算</a>
                        </div>
                        <span class="cartM clear-fix">购物车中还没有商品，赶紧选购吧！</span>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <div id="site-header">
        <div class="site-header-con">
            <!-- logo -->
            <div class="header-logo">
                <a href="https://www.mi.com/index.html" title="小米官网" class="logo ir">小米官网</a>
            </div>
            <!-- logo旁边的nav -->
            <div class="header-nav">
                <ul class="site-ul">
                    <li class="nav-category"><a href=""><span class="text">全部商品分类</span></a>
                        <div class="site-category" style="display: block;">
                            <ul class="site-categoryList">
                                <li class="categoryItem"><a href="" class="title">手机电话卡 <span class="iconfont icon-youjiantou
"></span></a></li>
                                <li class="categoryItem"><a href="" class="title">电视盒子<span class="iconfont icon-youjiantou
                                "></span></a></li>
                                <li class="categoryItem"><a href="" class="title">笔记本示器<span class="iconfont icon-youjiantou
                                "></span></a></li>
                                <li class="categoryItem"><a href="" class="title">家电插线板<span class="iconfont icon-youjiantou
                                "></span></a></li>
                                <li class="categoryItem"><a href="" class="title">出行穿戴<span class="iconfont icon-youjiantou
                                "></span></a></li>
                                <li class="categoryItem"><a href="" class="title">智能路由器<span class="iconfont icon-youjiantou
                                "></span></a></li>
                                <li class="categoryItem"><a href="" class="title">电源配件<span class="iconfont icon-youjiantou
                                "></span></a></li>
                                <li class="categoryItem"><a href="" class="title">健康儿童<span class="iconfont icon-youjiantou
                                "></span></a></li>
                                <li class="categoryItem"><a href="" class="title">耳机音箱<span class="iconfont icon-youjiantou
                                "></span></a></li>
                                <li class="categoryItem"><a href="" class="title">生活箱包<span class="iconfont icon-youjiantou
                                "></span></a></li>
                            </ul>
                        </div>
                    </li>
                    <li class='nav-item'><a href=""><span class="text">小米手机</span></a> </li>
                    <li class='nav-item'><a href=""><span class="text">Redmi红米</span></a> </li>
                    <li class='nav-item'><a href=""><span class="text">电视</span></a> </li>
                    <li class='nav-item'><a href=""><span class="text">笔记本</span></a> </li>
                    <li class='nav-item'><a href=""><span class="text">家电</span></a> </li>
                    <li class='nav-item'><a href=""><span class="text">路由器</span></a> </li>
                    <li class='nav-item'><a href=""><span class="text">智能硬件</span></a> </li>
                    <li class='nav-item'><a href=""><span class="text">服务</span></a> </li>
                    <li class='nav-item'><a href=""><span class="text">社区</span></a> </li>
                </ul>
            </div>
            <!-- logo最右边的搜索框 -->
            <div class="header-search">
                <form action="">
                    <input type="text" placeholder="小米">
                    <input type="submit" class="iconfont" value="&#xe610;">
                    <div class="keyWord">
                        <ul>
                            <li>全部商品</li>
                            <li>空调</li>
                            <li>小米手机</li>
                            <li>小米11 Pro</li>
                            <li>洗衣机</li>
                            <li>耳机</li>
                        </ul>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div id="header-nav-menu">
        <div class="header-nav-menu-con">
            <ul class="nav-menu-ul">
                <li><a href=""></a>
                    <div class="phone-box"><img src="./images/mi fold.webp" style='width:296px;height:180px' alt="">
                    </div>
                    <div class="title">小米MIX FOLD</div>
                    <p class="price">9999元</p>
                </li>
                <li><a href=""></a>
                    <div class="phone-box"><img src="./images/mi fold.webp" alt=""></div>
                    <div class="title">小米MIX FOLD</div>
                    <p class="price">9999元</p>
                </li>
                </li>
                <li><a href=""></a>
                    <div class="phone-box"><img src="./images/mi fold.webp" alt=""></div>
                    <div class="title">小米MIX FOLD</div>
                    <p class="price">9999元</p>
                </li>
                </li>
                <li><a href=""></a>
                    <div class="phone-box"><img src="./images/mi fold.webp" alt=""></div>
                    <div class="title">小米MIX FOLD</div>
                    <p class="price">9999元</p>
                </li>
                </li>
                <li><a href=""></a>
                    <div class="phone-box"><img src="./images/mi fold.webp" alt=""></div>
                    <div class="title">小米MIX FOLD</div>
                    <p class="price">9999元</p>
                </li>
                </li>
                <li><a href=""></a>
                    <div style="border: none;" class="phone-box"><img src="./images/mi fold.webp" alt=""></div>
                    <div class="title">小米MIX FOLD</div>
                    <p class="price">9999元</p>
                </li>
                </li>
            </ul>
        </div>
    </div>
    <!-- 轮播图 -->
    <div id="banner">
        <div class="banner-con">
            <div class="swiper-container" id="swiper">
                <div class="swiper-wrapper stop-swiping">
                    <div class="swiper-slide"><img src="./images/banner.webp" alt=""></div>
                    <div class="swiper-slide"><img src="./images/wzry.jpeg" alt=""></div>
                    <div class="swiper-slide"><img src="./images/banner2.jpg" alt=""></div>
                    <div class="swiper-slide"><img src="./images/banner2.webp" alt=""></div>
                    <div class="swiper-slide"><img src="./images/banner3.webp" alt=""></div>
                </div>
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination circle"></div>

                <!-- 如果需要导航按钮 -->
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
            </div>
        </div>
    </div>
    <!-- 轮播图下面的一行 -->
    <div class="homeSub">
        <span class="span4">
            <ul class="s_ul">
                <li><a href=""><img src="./images/time.png" alt="">小米秒杀</a></li>
                <li><a href=""><img src="./images/home.png" alt="">企业团购</a></li>
                <li><a href=""><img src="./images/Fma.png" alt="">F码通道</a></li>
                <li><a href=""><img src="./images/card.png" alt="">米粉卡</a></li>
                <li><a href=""><img src="./images/money.png" alt="">以旧换新</a></li>
                <li><a href=""><img src="./images/phone.png" alt="">话费充值</a></li>
            </ul>
        </span>
        <span class="span16">
            <ul>
                <li><a href=""><img src="./images/9A.jpg" alt=""></a></li>
                <li><a href=""><img src="./images/11.jpg" alt=""></a></li>
                <li style="margin-right: 0;"><a href=""><img src="./images/color.jpg" alt=""></a></li>
            </ul>
        </span>
    </div>
    <!-- main模块 -->
    <div id="mainPage">
        <div class="main-con">
            <!-- 秒杀 -->
            <div class="miaosha">
                <div class="boxHd">
                    <h2 class="title">
                        小米秒杀
                    </h2>
                </div>
                <div class="boxBd">
                    <div class="row">
                        <div class="msBox span4">
                            <div class="round">

                            </div>
                            <img src="./images/sd.jpg" alt="">
                            <div class="desc">距离结束还有</div>
                            <div class="countdown">
                                <span></span><i>:</i><span></span><i>:</i><span></span>
                            </div>
                        </div>
                        <div class="sBox2">
                            <div class="swiper-container stop-swiping" id="swiper2">
                                <div class="swiper-wrapper">
                                    <div class="swiper-slide rainbow1 "><img src="./images/banner2_1.webp" alt="">
                                        <h3 class="title">
                                            日常元素抽纸 青春版 24包/箱
                                        </h3>
                                        <p class="desc">精选原生竹浆，健康环保</p>
                                        <p class="price">
                                            <span>25.9</span>元
                                            <del>32.9元</del>
                                        </p>
                                    </div>
                                    <div class="swiper-slide rainbow2"><img src="./images/banner2_2.webp" alt="">
                                        <h3 class="title">
                                            米家定制T恤 黑色 XL
                                        </h3>
                                        <p class="desc">米家定制T恤</p>
                                        <p class="price">
                                            <span>129</span>元
                                            <del>149元</del>
                                        </p>
                                    </div>
                                    <div class="swiper-slide rainbow3"><img src="./images/banner2_3.webp" alt="">
                                        <h3 class="title">
                                            小米净水器400G增强版 白色
                                        </h3>
                                        <p class="desc">RO反渗透，大流量直出纯净水</p>
                                        <p class="price">
                                            <span>999</span>元
                                            <del>1299元</del>
                                        </p>
                                    </div>
                                    <div class="swiper-slide rainbow4"><img src="./images/banner2_4.png" alt="">
                                        <h3 class="title">
                                            米兔智能故事机 白色
                                        </h3>
                                        <p class="desc">能说会道，好玩伴</p>
                                        <p class="price">
                                            <span>169</span>元
                                            <del>199元</del>
                                        </p>
                                    </div>
                                    <div class="swiper-slide rainbow5"><img src="./images/banner2_5.webp" alt="">
                                        <h3 class="title">
                                            米家防蓝光眼镜钛轻盈 黑色
                                        </h3>
                                        <p class="desc">超轻超透，防蓝光护眼</p>
                                        <p class="price">
                                            <span>189</span>元
                                            <del>199元</del>
                                        </p>
                                    </div>
                                    <div class="swiper-slide rainbow1"><img src="./images/banner2_6.webp" alt="">
                                        <h3 class="title">
                                            智能积木 公路赛车 白色
                                        </h3>
                                        <p class="desc">烧脑搭建，尽兴狂奔</p>
                                        <p class="price">
                                            <span>229</span>元
                                            <del>299元</del>
                                        </p>
                                    </div>
                                    <div class="swiper-slide rainbow2"><img src="./images/banner2_7.webp" alt="">
                                        <h3 class="title">
                                            米家电动剃须刀S500C 黑色
                                        </h3>
                                        <p class="desc">一机三用，面面俱到</p>
                                        <p class="price">
                                            <span>279</span>元
                                            <del>299元</del>
                                        </p>
                                    </div>
                                    <div class="swiper-slide rainbow3"><img src="./images/banner2_8.webp" alt="">
                                        <h3 class="title">
                                            纳拓户外六合一雷鸣手电 黑色
                                        </h3>
                                        <p class="desc">一键声光报警 1000流明高亮</p>
                                        <p class="price">
                                            <span>139</span>元
                                            <del>179元</del>
                                        </p>
                                    </div>
                                    <div class="swiper-slide rainbow4"><img src="./images/banner2_9.webp" alt="">
                                        <h3 class="title">
                                            inFace黑头仪吸
                                        </h3>
                                        <p class="desc">净黑头高效不伤肤</p>
                                        <p class="price">
                                            <span>109</span>元
                                            <del>149元</del>
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div class="swiperControls">
                                <div class="swiper-button-next"></div>
                                <div class="swiper-button-prev"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- note9 banner -->
            <div class="note_banner">
                <a href=""><img src="./images/Note9_banner.webp" alt=""></a>
            </div>
            <!-- 手机展示 -->
            <div id="iphone" class="phoneDisplay">
                <div class="boxHd">
                    <h2 class="title">
                        手机
                    </h2>
                    <div class="more">
                        <a href="" class="moreLink">查看更多<i class="iconfont icon-youjiantou"></i></a>
                    </div>
                </div>
                <div class="box_bd">
                    <div class="row">
                        <div class="span4" style="width: 234px;">
                            <ul class="phoneList">
                                <li class="phoneItem">
                                    <a href=""><img src="./images/phone/phone1.webp" alt=""></a>
                                </li>
                            </ul>
                        </div>
                        <div class="span16" style="width: 978px;">
                            <!-- 右半部分 -->
                            <ul class="phonesList">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/phone/2.webp" alt="">
                                        </div>
                                        <h3 class="title">小米MIX FOLD</h3>
                                        <p class="desc">折叠大屏｜自研芯片</p>
                                        <p class="price">
                                            <span class="num">9999</span>元<span>起</span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/phone/3.webp" alt="">
                                        </div>
                                        <h3 class="title">小米11 Ultra</h3>
                                        <p class="desc">1.12""GN2 |2K四微曲屏</p>
                                        <p class="price">
                                            <span class="num">5999</span>元<span>起</span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/phone/4.webp" alt="">
                                        </div>
                                        <h3 class="title">小米11 Pro</h3>
                                        <p class="desc">1.12""GN2|骁龙888</p>
                                        <p class="price">
                                            <span class="num">4999</span>元<span>起</span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="./detail.html">
                                        <div class="figure">
                                            <img src="./images/phone/5.webp" alt="">
                                        </div>
                                        <h3 class="title">小米11青春版</h3>
                                        <p class="desc">小米11青春版轻薄</p>
                                        <p class="price">
                                            <span class="num">2299</span>元<span>起</span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/phone/6.webp" alt="">
                                        </div>
                                        <h3 class="title">K40游戏增强版</h3>
                                        <p class="desc">轻薄电竞设计</p>
                                        <p class="price">
                                            <span class="num">1999</span>元<span>起</span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/phone/7.webp" alt="">
                                        </div>
                                        <h3 class="title">黑鲨4 Pro</h3>
                                        <p class="desc">黑鲨4 Pro</p>
                                        <p class="price">
                                            <span class="num">3999</span>元<span>起</span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/phone/8.webp" alt="">
                                        </div>
                                        <h3 class="title">黑鲨4</h3>
                                        <p class="desc">黑鲨4磁动力升降肩键</p>
                                        <p class="price">
                                            <span class="num">2499</span>元<span>起</span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/phone/9.webp" alt="">
                                        </div>
                                        <h3 class="title">小米10S</h3>
                                        <p class="desc">骁龙870|对称式双扬立体声</p>
                                        <p class="price">
                                            <span class="num">3299</span>元<span>起</span>
                                        </p>
                                    </a>
                                </li>
                            </ul>

                        </div>
                    </div>
                </div>
            </div>
            <div class="note_banner">
                <a href=""><img src="./images/longBanner/banner2.webp" alt=""></a>
            </div>
            <!-- 家电展示 -->
            <div id="TV" class="phoneDisplay">
                <div class="boxHd">
                    <h2 class="title">
                        家电
                    </h2>
                    <div class="more">
                        <ul class="tabList">
                            <li>热门</li>
                            <li>电视影音</li>
                        </ul>
                    </div>
                </div>
                <div class="box_bd">
                    <div class="row">
                        <div class="span4" style="width: 234px;">
                            <ul class="phoneList">
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img src="./images/furniture/1.webp" style="height: 300px;" alt=""></a>
                                </li>
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img style="height: 300px;" src="./images/furniture/2.webp" alt=""></a>
                                </li>
                            </ul>
                        </div>
                        <div class="span16" style="width: 978px;position: relative;">
                            <!-- 右半部分 -->
                            <!-- 热门 -->
                            <ul class="phonesList">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/furniture/3.webp" alt="">
                                        </div>
                                        <h3 class="title">小米全面屏电视65英寸E65X</h3>
                                        <p class="desc">全面屏设计</p>
                                        <p class="price">
                                            <span class="num">3099</span>元<span><del><span
                                                        class="num">3299</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/furniture/4.webp" alt="">
                                        </div>
                                        <h3 class="title">全面屏电视E43K</h3>
                                        <p class="desc">全面屏设计，海量内容</p>
                                        <p class="price">
                                            <span class="num">1399</span>元<span><del><span
                                                        class="num">1599</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/furniture/5.webp" alt="">
                                        </div>
                                        <h3 class="title">小米电视4A70英寸</h3>
                                        <p class="desc">大屏更享受</p>
                                        <p class="price">
                                            <span class="num">3599</span>元<span><del><span
                                                        class="num">3999</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/furniture/6.webp" alt="">
                                        </div>
                                        <h3 class="title">米家互联网对开门冰箱54OL</h3>
                                        <p class="desc">重磅新品福利特惠</p>
                                        <p class="price">
                                            <span class="num">2899</span>元<span><del><span
                                                        class="num">3699</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/furniture/7.webp" alt="">
                                        </div>
                                        <h3 class="title">Redmi全自动波轮洗衣机1A 8kg</h3>
                                        <p class="desc">—键操作，父母都爱用</p>
                                        <p class="price">
                                            <span class="num">799</span>元<span><del><span
                                                        class="num">899</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/furniture/8.webp" alt="">
                                        </div>
                                        <h3 class="title">米家互联网烟灶套装(天然气)</h3>
                                        <p class="desc">点火排烟，风随火动</p>
                                        <p class="price">
                                            <span class="num">2099</span>元<span><del><span
                                                        class="num">2298</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/furniture/9.webp" alt="">
                                        </div>
                                        <h3 class="title">米家电烤箱</h3>
                                        <p class="desc">全能共焙体验</p>
                                        <p class="price">
                                            <span class="num">299</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/furniture/10.jpg" alt="">
                                        </div>
                                        <h3 class="title">小米米家空气净化器 2S</h3>
                                        <p class="price">
                                            <span class="num">649</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>热门</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                            <!-- 电视影音 -->
                            <ul class="phonesList" style="display: none;">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/TV/1.webp" alt="">
                                        </div>
                                        <h3 class="title">全面屏电视E43K</h3>
                                        <p class="desc">全面屏设计，海量内容</p>
                                        <p class="price">
                                            <span class="num">1399</span>元<span><del><span
                                                        class="num">1599</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/TV/2.webp" alt="">
                                        </div>
                                        <h3 class="title">全面屏电视55英寸E55X</h3>
                                        <p class="desc">潮流全面屏设计</p>
                                        <p class="price">
                                            <span class="num">2399</span>元<span><del><span
                                                        class="num">2599</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/TV/3.webp" alt="">
                                        </div>
                                        <h3 class="title">小米电视4A60英寸</h3>
                                        <p class="desc">人工智能语音系统,超高清画质</p>
                                        <p class="price">
                                            <span class="num">27799</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/TV/4.jpg" alt="">
                                        </div>
                                        <h3 class="title">小米电视4S 75英寸</h3>
                                        <p class="desc">4K HDR,人工智能语音</p>
                                        <p class="price">
                                            <span class="num">4699</span>元<span><del><span
                                                        class="num">5999</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/TV/5.webp" alt="">
                                        </div>
                                        <h3 class="title">小米全面屏电视65英寸E65X</h3>
                                        <p class="desc">全面屏设计</p>
                                        <p class="price">
                                            <span class="num">2999</span>元<span><del><span
                                                        class="num">3299</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/TV/6.webp" alt="">
                                        </div>
                                        <h3 class="title">小米全面屏电视E32C</h3>
                                        <p class="desc">全面屏设计，人工智能系统</p>
                                        <p class="price">
                                            <span class="num">949</span>元<span><del><span
                                                        class="num">1099</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/TV/7.webp" alt="">
                                        </div>
                                        <h3 class="title">Redmi智能电视A55</h3>
                                        <p class="desc">渍湃音效影院级体验</p>
                                        <p class="price">
                                            <span class="num">2199</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/TV/8.webp" alt="">
                                        </div>
                                        <h3 class="title">Redmi智能电视MAX 98"</h3>
                                        <p class="price">
                                            <span class="num">19999</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>电视影音</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <!-- note9 banner -->
            <div class="note_banner">
                <a href=""><img src="./images/longBanner/3.webp" alt=""></a>
            </div>
            <!-- 智能展示 -->
            <div id="intelligent" class="phoneDisplay">
                <div class="boxHd">
                    <h2 class="title">
                        智能
                    </h2>
                    <div class="more">
                        <ul class="tabList">
                            <li>热门</li>
                            <li>安防</li>
                            <li>出行</li>
                        </ul>
                    </div>
                </div>
                <div class="box_bd">
                    <div class="row">
                        <div class="span4" style="width: 234px;">
                            <ul class="phoneList">
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img src="./images/hot/1.webp" style="height: 300px;" alt=""></a>
                                </li>
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img style="height: 300px;" src="./images/hot/2.webp" alt=""></a>
                                </li>
                            </ul>
                        </div>
                        <div class="span16" style="width: 978px;position: relative;">
                            <!-- 右半部分 -->
                            <!-- 热门 -->
                            <ul class="phonesList">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/hot/3.webp" alt="">
                                        </div>
                                        <h3 class="title">小米小爱音箱Play</h3>
                                        <p class="desc">听音乐、语音遥控家电</p>
                                        <p class="price">
                                            <span class="num">109</span>元<span><del><span
                                                        class="num">169</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/hot/4.webp" alt="">
                                        </div>
                                        <h3 class="title">米家智能窗帘</h3>
                                        <p class="desc">窗帘开合随心控</p>
                                        <p class="price">
                                            <span class="num">799</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/hot/5.webp" alt="">
                                        </div>
                                        <h3 class="title">小米体脂秤2</h3>
                                        <p class="desc">轻松掌握身体脂肪率</p>
                                        <p class="price">
                                            <span class="num">99</span>元<span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/hot/6.jpg" alt="">
                                        </div>
                                        <h3 class="title">九号平衡车</h3>
                                        <p class="desc">年轻人的酷玩具</p>
                                        <p class="price">
                                            <span class="num">1799</span>元<span><del><span
                                                        class="num">1999</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/hot/7.webp" alt="">
                                        </div>
                                        <h3 class="title">小米智能门锁推拉式</h3>
                                        <p class="desc">—步推拉，高端智能门锁</p>
                                        <p class="price">
                                            <span class="num">1699</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/hot/8.webp" alt="">
                                        </div>
                                        <h3 class="title">Redmi小爱触屏音箱8英寸</h3>
                                        <p class="desc">超大屏，让智能更多可能</p>
                                        <p class="price">
                                            <span class="num">349</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/hot/9.webp" alt="">
                                        </div>
                                        <h3 class="title">小米手环5</h3>
                                        <p class="desc">11种运动模式磁吸式充电</p>
                                        <p class="price">
                                            <span class="num">169</span>元<span><del><span
                                                        class="num">189</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/hot/10.webp" alt="">
                                        </div>
                                        <h3 class="title">米家空气净化器Pro</h3>
                                        <p class="price">
                                            <span class="num">1099</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>热门</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                            <!-- 安防 -->
                            <ul class="phonesList" style="display: none;">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/af/1.webp" alt="">
                                        </div>
                                        <h3 class="title">米家智能门锁推拉式通用版</h3>
                                        <p class="desc">—步推拉，高端智能门锁</p>
                                        <p class="price">
                                            <span class="num">1699</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/af/2.webp" alt="">
                                        </div>
                                        <h3 class="title">米家智能门锁青春版</h3>
                                        <p class="desc">隐形指纹识别设计简单一步快进家门</p>
                                        <p class="price">
                                            <span class="num">999</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/af/3.webp" alt="">
                                        </div>
                                        <h3 class="title">米家智能门锁霸王锁体碳素黑</h3>
                                        <p class="desc">—体化活体指纹识别，多种开锁方式</p>
                                        <p class="price">
                                            <span class="num">1599</span>元<span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/af/4.webp" alt="">
                                        </div>
                                        <h3 class="title">米家智能门锁霸王锁体磨砂金</h3>
                                        <p class="desc">适配霸王锁体，多种开锁方式</p>
                                        <p class="price">
                                            <span class="num">1799</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>热门</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                            <!-- 出行 -->
                            <ul class="phonesList" style="display: none;">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/outside/1.jpg" alt="">
                                        </div>
                                        <h3 class="title">米兔折叠婴儿推车</h3>
                                        <p class="desc">出发去向往的地方</p>
                                        <p class="price">
                                            <span class="num">699</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/outside/2.png" alt="">
                                        </div>
                                        <h3 class="title">九号平衡车Plus</h3>
                                        <p class="desc">—个形影不离的新伙伴</p>
                                        <p class="price">
                                            <span class="num">2999</span>元<del><span
                                                    class="num">3499</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/outside/3.webp" alt="">
                                        </div>
                                        <h3 class="title">米家充气宝</h3>
                                        <p class="desc">便携电动打气筒</p>
                                        <p class="price">
                                            <span class="num">199</span>元<span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/outside/4.webp" alt="">
                                        </div>
                                        <h3 class="title">小米小背包</h3>
                                        <p class="desc">城市休闲,简约设计</p>
                                        <p class="price">
                                            <span class="num">29</span>元起
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/outside/5.webp" alt="">
                                        </div>
                                        <h3 class="title">小米旅行箱青春款</h3>
                                        <p class="desc">环保材料，轻便重量</p>
                                        <p class="price">
                                            <span class="num">199</span>元起
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/outside/6.webp" alt="">
                                        </div>
                                        <h3 class="title">骑记电动助力自行车新国标版...</h3>
                                        <p class="desc">更多助力选择,更多城市风景</p>
                                        <p class="price">
                                            <span class="num">2799</span>元<del><span
                                                    class="num">2999</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/outside/7.webp" alt="">
                                        </div>
                                        <h3 class="title">小米米家对讲机2</h3>
                                        <p class="desc">向更远出发</p>
                                        <p class="price">
                                            <span class="num">449</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/outside/8.jpg" alt="">
                                        </div>
                                        <h3 class="title">九号平衡车</h3>
                                        <p class="price">
                                            <span class="num">1799</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>出行</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <!-- note9 banner -->
            <div class="note_banner">
                <a href=""><img src="./images/longBanner/4.webp" alt=""></a>
            </div>
            <!-- 搭配 -->
            <div id='wear' class="phoneDisplay">
                <div class="boxHd">
                    <h2 class="title">
                        搭配
                    </h2>
                    <div class="more">
                        <ul class="tabList">
                            <li>热门</li>
                            <li>耳机音箱</li>
                        </ul>
                    </div>
                </div>
                <div class="box_bd">
                    <div class="row">
                        <div class="span4" style="width: 234px;">
                            <ul class="phoneList">
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img src="./images/dapei/1.webp" style="height: 300px;" alt=""></a>
                                </li>
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img style="height: 300px;" src="./images/dapei/2.webp" alt=""></a>
                                </li>
                            </ul>
                        </div>
                        <div class="span16" style="width: 978px;position: relative;">
                            <!-- 右半部分 -->
                            <!-- 热门 -->
                            <ul class="phonesList">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/dapei/3.webp" alt="">
                                        </div>
                                        <h3 class="title">小米真无线蓝牙耳机Air 2 Pro</h3>
                                        <p class="desc">主动降噪/持久续航/无线充</p>
                                        <p class="price">
                                            <span class="num">699</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/dapei/4.webp" alt="">
                                        </div>
                                        <h3 class="title">高速无线充套装</h3>
                                        <p class="desc">快速无线闪充，Qi充电标准</p>
                                        <p class="price">
                                            <span class="num">149</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/dapei/5.webp" alt="">
                                        </div>
                                        <h3 class="title">Redmi AirDots 2真无线蓝牙耳机</h3>
                                        <p class="desc">支持蓝牙5.0，自动秒连，拿起就能用</p>
                                        <p class="price">
                                            <span class="num">99</span>元<span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/dapei/6.webp" alt="">
                                        </div>
                                        <h3 class="title">小米真无线蓝牙耳机Air 2s</h3>
                                        <p class="desc">全面升级，智慧真无线</p>
                                        <p class="price">
                                            <span class="num">399</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/dapei/7.webp" alt="">
                                        </div>
                                        <h3 class="title">Redmi充电宝10000mAh标准版...</h3>
                                        <p class="desc">10000mAh大电量</p>
                                        <p class="price">
                                            <span class="num">59</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/dapei/8.webp" alt="">
                                        </div>
                                        <h3 class="title">Redmi充电宝20000mAh快充版</h3>
                                        <p class="desc">大容量,可上飞机</p>
                                        <p class="price">
                                            <span class="num">99</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/dapei/9.jpg" alt="">
                                        </div>
                                        <h3 class="title">小米插线板5孔位</h3>
                                        <p class="desc">多重安全保护</p>
                                        <p class="price">
                                            <span class="num">39</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/dapei/10.webp" alt="">
                                        </div>
                                        <h3 class="title">小米小爱触屏音箱</h3>
                                        <p class="price">
                                            <span class="num">219</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>热门</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                            <!-- 耳机音箱 -->
                            <ul class="phonesList" style="display: none;">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/earphone/1.webp" alt="">
                                        </div>
                                        <h3 class="title">Redmi AirDots 2真无线蓝牙耳机</h3>
                                        <p class="desc">支持蓝牙5.0，自动秒连，拿起就能用</p>
                                        <p class="price">
                                            <span class="num">99</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/earphone/2.webp" alt="">
                                        </div>
                                        <h3 class="title">小米真无线蓝牙耳机Air 2s</h3>
                                        <p class="desc">全面升级,智慧真无线</p>
                                        <p class="price">
                                            <span class="num">399</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/earphone/3.webp" alt="">
                                        </div>
                                        <h3 class="title">小米降噪项圈蓝牙耳机</h3>
                                        <p class="desc">无线降噪,静无止境</p>
                                        <p class="price">
                                            <span class="num">399</span>元<span><span><del><span
                                                            class="num">189</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/earphone/4.webp" alt="">
                                        </div>
                                        <h3 class="title">小米小爱音箱Pro</h3>
                                        <p class="desc">语音遥控5000+品牌主流家电</p>
                                        <p class="price">
                                            <span class="num">299</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/earphone/5.webp" alt="">
                                        </div>
                                        <h3 class="title">小米小爱音箱Art电池版</h3>
                                        <p class="desc">不插电,让音乐更自由</p>
                                        <p class="price">
                                            <span class="num">399</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/earphone/6.webp" alt="">
                                        </div>
                                        <h3 class="title">小米小爱音箱Art</h3>
                                        <p class="desc">极光下的声音艺术</p>
                                        <p class="price">
                                            <span class="num">349</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/earphone/7.webp" alt="">
                                        </div>
                                        <h3 class="title">小米小爱音箱</h3>
                                        <p class="desc">全面升级旗舰音质</p>
                                        <p class="price">
                                            <span class="num">249</span>元<span><del><span
                                                        class="num">269</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/earphone/8.jpg" alt="">
                                        </div>
                                        <h3 class="title">小米Al音箱</h3>
                                        <p class="price">
                                            <span class="num">229</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>耳机音箱</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <!-- note9 banner -->
            <div class="note_banner">
                <a href=""><img src="./images/longBanner/5.webp" alt=""></a>
            </div>
            <!-- 配件 -->
            <div id='tool' class="phoneDisplay">
                <div class="boxHd">
                    <h2 class="title">
                        配件
                    </h2>
                    <div class="more">
                        <ul class="tabList">
                            <li>热门</li>
                            <li>充电器</li>
                        </ul>
                    </div>
                </div>
                <div class="box_bd">
                    <div class="row">
                        <div class="span4" style="width: 234px;">
                            <ul class="phoneList">
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img src="./images/peijian/1.webp" style="height: 300px;" alt=""></a>
                                </li>
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img style="height: 300px;" src="./images/peijian/2.webp" alt=""></a>
                                </li>
                            </ul>
                        </div>
                        <div class="span16" style="width: 978px;position: relative;">
                            <!-- 右半部分 -->
                            <!-- 热门 -->
                            <ul class="phonesList">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/peijian/3.webp" alt="">
                                        </div>
                                        <h3 class="title">小米氮化家GaN充电器Type-C ...</h3>
                                        <p class="desc">氮化嫁黑科技65W MAX大功率快充</p>
                                        <p class="price">
                                            <span class="num">149</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/peijian/4.webp" alt="">
                                        </div>
                                        <h3 class="title">高速无线充套装</h3>
                                        <p class="desc">快速无线闪充，Qi充电标准</p>
                                        <p class="price">
                                            <span class="num">149</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/peijian/5.webp" alt="">
                                        </div>
                                        <h3 class="title">小米无线充电宝青春版10000mAh</h3>
                                        <p class="desc">能量满满，无线有线都能充</p>
                                        <p class="price">
                                            <span class="num">129</span>元<span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/peijian/6.webp" alt="">
                                        </div>
                                        <h3 class="title">小米车载充电器快充版</h3>
                                        <p class="desc">双口快充，安全稳定</p>
                                        <p class="price">
                                            <span class="num">69</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/peijian/7.webp" alt="">
                                        </div>
                                        <h3 class="title">小米Type-C转Lightning数据线1m</h3>
                                        <p class="desc">华果MFi官方认证,支持快充</p>
                                        <p class="price">
                                            <span class="num">59</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/peijian/8.webp" alt="">
                                        </div>
                                        <h3 class="title">小米车载充电器快充版1A1C10...</h3>
                                        <p class="desc">小米车载充电器快充版1A1C 100Ww</p>
                                        <p class="price">
                                            <span class="num">99</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/peijian/9.webp" alt="">
                                        </div>
                                        <h3 class="title">小米氮化家GaN充电器Type-C ...</h3>
                                        <p class="desc">氮化家黑科技65W MAX大功率快充</p>
                                        <p class="price">
                                            <span class="num">149</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/peijian/10.jpg" alt="">
                                        </div>
                                        <h3 class="title">小米二合一数据线100cm</h3>
                                        <p class="price">
                                            <span class="num">24.9</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>热门</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                            <!-- 充电器 -->
                            <ul class="phonesList" style="display: none;">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/a_out/1.webp" alt="">
                                        </div>
                                        <h3 class="title">小米氨化家GaN充电器Type-C ...</h3>
                                        <p class="desc">氮化家黑科技65W MAX大功率快充</p>
                                        <p class="price">
                                            <span class="num">149</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/charge/2.webp" alt="">
                                        </div>
                                        <h3 class="title">小米立式风冷无线充30W</h3>
                                        <p class="desc">解锁充电新姿势</p>
                                        <p class="price">
                                            <span class="num">199</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/charge/3.webp" alt="">
                                        </div>
                                        <h3 class="title">小米立式无线充电器通用快充2...</h3>
                                        <p class="desc">横竖可充，迅速感应边充边玩</p>
                                        <p class="price">
                                            <span class="num">99</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/charge/4.jpg" alt="">
                                        </div>
                                        <h3 class="title">米家插线板6位基础版（含3口U...</h3>
                                        <p class="desc">巧设计，便捷不占地儿</p>
                                        <p class="price">
                                            <span class="num">79</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/charge/5.jpg" alt="">
                                        </div>
                                        <h3 class="title">小米插线板(含3口USB2A快充)</h3>
                                        <p class="desc">3个USB充电口，支持快充</p>
                                        <p class="price">
                                            <span class="num">49</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/charge/6.webp" alt="">
                                        </div>
                                        <h3 class="title">小米Type-C充电器快充版20w</h3>
                                        <p class="desc">智能兼容/小巧易携带</p>
                                        <p class="price">
                                            <span class="num">39</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/charge/7.webp" alt="">
                                        </div>
                                        <h3 class="title">小米氮化家GaN充电器Type-C ...</h3>
                                        <p class="desc">氮化家黑科技65W MAX大功率快充</p>
                                        <p class="price">
                                            <span class="num">149</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>耳机音箱</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <!-- note9 banner -->
            <div class="note_banner">
                <a href=""><img src="./images/longBanner/6.webp" alt=""></a>
            </div>
            <!-- 周边 -->
            <div id="around" class="phoneDisplay">
                <div class="boxHd">
                    <h2 class="title">
                        周边
                    </h2>
                    <div class="more">
                        <ul class="tabList">
                            <li>热门</li>
                            <li>出行</li>
                        </ul>
                    </div>
                </div>
                <div class="box_bd">
                    <div class="row">
                        <div class="span4" style="width: 234px;">
                            <ul class="phoneList">
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img src="./images/around/1.webp" style="height: 300px;" alt=""></a>
                                </li>
                                <li class="phoneItem furnitureItem">
                                    <a href=""><img style="height: 300px;" src="./images/around/2.webp" alt=""></a>
                                </li>
                            </ul>
                        </div>
                        <div class="span16" style="width: 978px;position: relative;">
                            <!-- 右半部分 -->
                            <!-- 热门 -->
                            <ul class="phonesList">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/around/3.webp" alt="">
                                        </div>
                                        <h3 class="title">米家飞行员太阳镜Pro</h3>
                                        <p class="desc">尼龙偏光,轻巧佩戴</p>
                                        <p class="price">
                                            <span class="num">189</span>元<span><del><span
                                                        class="num">199</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/around/4.webp" alt="">
                                        </div>
                                        <h3 class="title">小米巨能写中性笔10支装</h3>
                                        <p class="desc">—支顶4支，超长顺滑书写</p>
                                        <p class="price">
                                            <span class="num">9.99</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/around/5.webp" alt="">
                                        </div>
                                        <h3 class="title">米家迷你保温杯</h3>
                                        <p class="desc">可以随身携带的温度</p>
                                        <p class="price">
                                            <span class="num">49</span>元<span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/around/6.jpg" alt="">
                                        </div>
                                        <h3 class="title">贝医生巴氏牙刷四色装</h3>
                                        <p class="desc">进口刷毛,好品质</p>
                                        <p class="price">
                                            <span class="num">39.9</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/around/7.webp" alt="">
                                        </div>
                                        <h3 class="title">米家运动鞋4</h3>
                                        <p class="desc">轻盈若絮,弹若脱兔</p>
                                        <p class="price">
                                            <span class="num">199</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/around/8.webp" alt="">
                                        </div>
                                        <h3 class="title">米家指甲刀五件套</h3>
                                        <p class="desc">轻巧多用，优雅随行</p>
                                        <p class="price">
                                            <span class="num">39.9</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/around/9.webp" alt="">
                                        </div>
                                        <h3 class="title">8H乳胶床垫2</h3>
                                        <p class="desc">软硬双面可睡</p>
                                        <p class="price">
                                            <span class="num">599</span>元起
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/around/10.webp" alt="">
                                        </div>
                                        <h3 class="title">日常元素抽纸青春版24包/箱</h3>
                                        <p class="price">
                                            <span class="num">25.9</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>热门</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                            <!-- 出行 -->
                            <ul class="phonesList" style="display: none;">
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/a_out/1.webp" alt="">
                                        </div>
                                        <h3 class="title">九号卡丁车Pro兰博基尼汽车定...</h3>
                                        <p class="desc">九号卡丁车Pro兰博基尼汽车定制版</p>
                                        <p class="price">
                                            <span class="num">9999</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/a_out/2.webp" alt="">
                                        </div>
                                        <h3 class="title">米家飞行员太阳镜Pro</h3>
                                        <p class="desc">尼龙偏光,轻巧佩戴</p>
                                        <p class="price">
                                            <span class="num">189</span>元<span><del><span
                                                        class="num">199</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/a_out/3.jpg" alt="">
                                        </div>
                                        <h3 class="title">九号平衡车</h3>
                                        <p class="desc">年轻人的酷玩具</p>
                                        <p class="price">
                                            <span class="num">1999</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/a_out/4.webp" alt="">
                                        </div>
                                        <h3 class="title">小米米家电动滑板车Pro</h3>
                                        <p class="desc">性能提升，动力更强劲</p>
                                        <p class="price">
                                            <span class="num">2799</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/a_out/5.webp" alt="">
                                        </div>
                                        <h3 class="title">米家经典方框太阳镜</h3>
                                        <p class="desc">复古设计,偏光自修复</p>
                                        <p class="price">
                                            <span class="num">89</span>元<span><del><span
                                                        class="num">99</span>元</del></span>
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/a_out/6.webp" alt="">
                                        </div>
                                        <h3 class="title">小米车载充电器快充版1A1C10...</h3>
                                        <p class="desc">小米车载充电器快充版1A1C 100Ww</p>
                                        <p class="price">
                                            <span class="num">99</span>元
                                        </p>
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/a_out/7.webp" alt="">
                                        </div>
                                        <h3 class="title">小米对讲机Lite</h3>
                                        <p class="desc">小米对讲机Lite</p>
                                        <p class="price">
                                            <span class="num">129</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure">
                                            <img src="./images/a_out/8.webp" alt="">
                                        </div>
                                        <h3 class="title">小米无线充电宝30W
                                            10000mAh</h3>
                                        <p class="price">
                                            <span class="num">199</span>元
                                        </p>
                                    </a>
                                </li>
                                <li class="airCondition">
                                    <a href="">
                                        <div class="figure figureMore">
                                            <i class="iconfont icon-arrow-1-right"></i>
                                        </div>
                                        <div class="more">
                                            浏览更多
                                            <small>出行</small>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <!-- note9 banner -->
            <div class="note_banner">
                <a href=""><img src="./images/longBanner/7.webp" alt=""></a>
            </div>
            <!-- 视频 -->
            <div class="phoneDisplay" style="height: 357px;">
                <div class="boxHd">
                    <h2 class="title">
                        视频
                    </h2>
                    <div class="more">
                        <a href="" class="moreLink">查看更多<i class="iconfont icon-youjiantou"></i></a>
                    </div>
                </div>
                <div class="box_bd">
                    <div class="row">
                        <div class="span16" style="width: 978px;">
                            <!-- 右半部分 -->
                            <ul class="phonesList videoList">
                                <li class="videoItem">
                                    <a href="">
                                        <div class="figureImg">
                                            <img src="./images/video/1.webp" alt=""
                                                style='width:296px;height:180px;margin: 0 0 28px;'>
                                            <span class="play"><i class="iconfont icon-bofang"></i></span>
                                        </div>
                                        <h3 class="title">2021年春季新品发布会第一场</h3>
                                        <p class="desc"></p>
                                    </a>
                                </li>
                                <li class="videoItem">
                                    <a href="">
                                        <div class="figureImg">
                                            <img src="./images/video/2.webp" alt=""
                                                style='width:296px;height:180px;margin: 0 0 28px;'>
                                            <span class="play"><i class="iconfont icon-bofang"></i></span>
                                        </div>
                                        <h3 class="title">Redmi 10X系列发布会</h3>
                                        <p class="desc">Redmi 10X系列发布会</p>
                                    </a>
                                </li>
                                <li class="videoItem">
                                    <a href="">
                                        <div class="figureImg">
                                            <img src="./images/video/3.webp"
                                                style='width:296px;height:180px;margin: 0 0 28px;' alt="">
                                            <span class="play"><i class="iconfont icon-bofang"></i></span>
                                        </div>
                                        <h3 class="title">小米10 青春版 发布会</h3>
                                        <p class="desc"></p>
                                    </a>
                                </li>
                                <li class="videoItem">
                                    <a href="">
                                        <div class="figureImg">
                                            <img src="./images/video/4.webp"
                                                style='width:296px;height:180px;margin: 0 0 28px;' alt="">
                                            <span class="play"><i class="iconfont icon-bofang"></i></span>
                                        </div>
                                        <h3 class="title">小米10 8K手机拍大片</h3>
                                        <p class="desc"></p>
                                    </a>
                                </li>
                            </ul>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 底部模块 -->
    <div id="bottom">
        <div class="bottom-con">
            <div class="bService">
                <ul>
                    <li><a href=""><em class="iconfont icon-editor2"></em>预约维修服务</a></li>
                    <li><a href=""><em class="iconfont icon-7"></em>7天无理由退货</a></li>
                    <li><a href=""><em class="iconfont icon-15"></em>15天免费换货</a></li>
                    <li><a href=""><em class="iconfont icon-liwu"></em>满69包邮</a></li>
                    <li><a href=""><em class="iconfont icon-tubiao"></em>520余家售后网点</a></li>
                </ul>
            </div>
            <div class="bLinks clear-fix">
                <dl class="colLinks">
                    <dt>帮助中心</dt>
                    <dd><a href="">小米之家</a></dd>
                    <dd><a href="">服务网点</a></dd>
                    <dd><a href="">授权体验店</a></dd>
                </dl>
                <dl class="colLinks">
                    <dt>服务支持</dt>
                    <dd><a href="">售后政策</a></dd>
                    <dd><a href="">自助服务</a></dd>
                    <dd><a href="">相关下载</a></dd>
                </dl>
                <dl class="colLinks">
                    <dt>线下门店</dt>
                    <dd><a href="">小米之家</a></dd>
                    <dd><a href="">服务网点</a></dd>
                    <dd><a href="">授权体验店</a></dd>
                </dl>
                <dl class="colLinks">
                    <dt>关于小米</dt>
                    <dd><a href="">了解小米</a></dd>
                    <dd><a href="">加入小米</a></dd>
                    <dd><a href="">投资者关系</a></dd>
                    <dd><a href="">企业社会责任</a></dd>
                    <dd><a href="">廉洁举报</a></dd>
                </dl>
                <dl class="colLinks">
                    <dt>关注我们</dt>
                    <dd><a href="">新浪微博</a></dd>
                    <dd><a href="">官方微信</a></dd>
                    <dd><a href="">联系我们</a></dd>
                    <dd><a href="">公益基金会</a></dd>
                </dl>
                <dl class="colLinks">
                    <dt>特色服务</dt>
                    <dd><a href="">F 码通道</a></dd>
                    <dd><a href="">礼物码</a></dd>
                    <dd><a href="">防伪查询</a></dd>
                </dl>
                <div class="colContact">
                    <p>400-100-5678</p>
                    <p>8:00-18:00（仅收市话费）</p>
                    <a href=""><em style="font-size: 12px;" class="iconfont icon-xinxi
"></em>人工客服</a>
                    <div class="follow">
                        关注小米:
                        <a href=""></a>
                        <a href=""></a>
                        <img src="./images/lastScode.png" alt="">
                    </div>
                </div>
            </div>
        </div>
        <div class="siteInfo">
            <div class="info-con">
                <div class="last-log ir">
                    小米官网
                </div>
                <div class="infoText">
                    <p class="sites"><a href="//www.mi.com/index.html">小米商城</a> <span class="sep">|</span> <a
                            href="//www.miui.com/">MIUI</a> <span class="sep">|</span> <a
                            href="//home.mi.com/index.html">米家</a> <span class="sep">|</span> <a
                            href="http://www.miliao.com/">米聊</a> <span class="sep">|</span> <a
                            href="//www.duokan.com/">多看</a> <span class="sep">|</span> <a
                            href="//game.xiaomi.com/">游戏</a> <span class="sep">|</span> <a
                            href="//b.mi.com/?client_id=180100031058&amp;masid=17409.0358">政企服务</a> <span
                            class="sep">|</span> <a href="//xiaomi.tmall.com/">小米天猫店</a> <span class="sep">|</span> <a
                            href="//privacy.mi.com/all/zh_CN/">小米集团隐私政策</a> <span class="sep">|</span> <a
                            href="//cdn.cnbj1.fds.api.mi-img.com/mi-mall/f516fe9e2c01.html">小米公司儿童信息保护规则</a> <span
                            class="sep">|</span> <a
                            href="//cdn.cnbj1.fds.api.mi-img.com/mi-mall/ded8d0e4a77d.html">小米商城隐私政策</a> <span
                            class="sep">|</span> <a href="//www.mi.com/about/user-agreement/">小米商城用户协议</a> <span
                            class="sep">|</span> <a href="//static.mi.com/feedback/">问题反馈</a> <span class="sep">|</span>
                        <a href="javascript:void(0);" class="J_siteGlobalRegion">Select Location</a>
                    </p>
                    <p class="sites"><a href="http://www.mi.com/beihu">北京互联网法院法律服务工作站</a> <span class="sep">|</span> <a
                            href="http://www.cca.org.cn/">中国消费者协会</a> <span class="sep">|</span> <a
                            href="http://www.bj315.org/">北京市消费者协会</a></p>
                    <p>
                        ©
                        <a href="javascript:;" title="mi.com">mi.com</a> 京ICP证110507号
                        <a href="http://beian.miit.gov.cn/">京ICP备10046444号</a> <a
                            href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802020134">京公网安备11010802020134号</a>
                        <a href="//www.mi.com/culture-license/">京网文[2020]0276-042号</a> <br> <a
                            href="//www.mi.com/medical/record/">（京）网械平台备字（2018）第00005号</a> <a
                            href="//www.mi.com/medical/qualification/">互联网药品信息服务资格证 (京)-非经营性-2014-0090</a> <a
                            href="//www.mi.com/business-license/">营业执照</a> <a
                            href="//www.mi.com/medical/list/">医疗器械质量公告</a> <br> <a
                            href="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/e0c7d4cf3b7cd88de10196e30c92e020.png">增值电信业务许可证</a>&nbsp;网络食品经营备案
                        京食药网食备202010048 &nbsp;
                        <a
                            href="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/c6859168166651511897f54fa1047fe3.png">食品经营许可证</a>
                        <br>
                        违法和不良信息举报电话：171-5104-4404&nbsp;<a
                            href="https://www.mi.com/intellectual">知识产权侵权投诉</a>&nbsp;本网站所列数据，除特殊说明，所有数据均出自我司实验室测试
                    </p>
                </div>
                <div class="infoLinks">
                    <a href=""><img src="./images/truste.png" alt=""></a><a href=""><img src="./images/v-logo-2.png"
                            alt=""></a><a href=""><img src="./images/icon3.png" alt=""></a><a href=""><img
                            src="./images/icon4.png" alt=""></a><a href=""><img src="./images/wsafe.png" alt=""><img
                            style="opacity: 0;" src="./images/276.png" alt=""></a>
                </div>
                <div class="slogan ir">
                    探索黑科技，小米为发烧而生
                </div>
            </div>
        </div>
    </div>
    <!-- 侧边栏 -->
    <div id="side-tab">
        <a class="sideItem">
            <div>
                <img src="./images/side/1.png" alt="">
                <img src="./images/side/2.png" alt="">
            </div>
            <span class="text">手机APP</span>
            <div class="popContent">
                <img src="./images/code.png" alt="">
                <span class="popDesc">扫码领取新人百元礼包</span>
            </div>
        </a>
        <a class="sideItem">
            <div>
                <img src="./images/side/3.png" alt="">
                <img src="./images/side/4.png" alt="">
            </div>
            <span class="text">个人中心</span>
        </a>
        <a class="sideItem">
            <div>
                <img src="./images/side/5.png" alt="">
                <img src="./images/side/6.png" alt="">
            </div>
            <span class="text">售后服务</span>
        </a>
        <a class="sideItem">
            <div>
                <img src="./images/side/7.png" alt="">
                <img src="./images/side/8.png" alt="">
            </div>
            <span class="text">人工客服</span>
        </a>
        <a class="sideItem">
            <div>
                <img src="./images/side/9.png" alt="">
                <img src="./images/side/10.png" alt="">
            </div>
            <span class="text">购物车</span>
        </a>
        <a class="sideItem backTop">
            <div>
                <img src="./images/side/totop.png" alt="">
                <img src="./images/side/totop_hover.png" alt="">
            </div>
            <span class="text">回顶部</span>
        </a>
    </div>
</body>
<script src="./lib/swiper.min.js"></script>

</html>